<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <style>
        .aui-bar-nav {
            background-color: #FFF;
            color: #000;
            position: fixed;
        }

        .aui-bar-nav .aui-iconfont {
            color: #000!important;
            font-weight: bold;
        }

        .aui-content {
            margin-top: 2.25rem;
            position: relative;
        }

        body,
        aui-content {
            background-color: #FAFAFA;
        }

        .register {}

        .register .logo-box img {
            width: 24%;
            margin: 2.4rem auto 0;
            border-radius: 50%;
            border: 1px solid #EEEEEE;
        }

        .register .from-box {
            width: 80%;
            margin: 2rem auto 0;
        }

        .register .from-box .flex-row {
            background-color: #FFF;
            display: flex;
            align-items: center;
            border: 1px solid #EEEEEE;
            padding-left: 0.5rem;
            border-radius: 0.2rem;
            margin-bottom: 0.6rem;
        }

        .register .from-box .flex-row img {
            width: 1.5rem;
            margin-right: 0.5rem;
            height: 1.5rem;
        }

        .register .from-box .flex-row input {
            flex: 1;
            height: 1.8rem;
            font-size: 0.8rem;
            margin: 0.2rem 0;
            color: #444;
            line-height: 1.8rem;
        }

        .register .from-box .flex-row input::-webkit-input-placeholder {
            color: #999999;
            font-size: 0.8rem;
        }

        .register .from-box .flex-row input:-moz-placeholder {
            color: #999999;
            font-size: 0.8rem;
        }

        .register .from-box .flex-row input::-moz-placeholder {
            color: #999999;
            font-size: 0.8rem;
        }

        .register .from-box .flex-row input:-ms-input-placeholder {
            color: #999999;
            font-size: 0.8rem;
        }

        .register .from-box .flex-row button {
            height: 2.2rem;
            width: 40%;
            color: #FFF;
            font-size: 0.8rem;
            display: block;
            border: none;
            border-radius: 0;
            margin: 0;
            background-color: #FE563A;
        }

        .register .login-btn button {
            display: block;
            width: 80%;
            margin: 2.4rem auto 0;
            background-color: #FE563A;
            border: none;
            font-size: 0.8rem;
            height: 2.2rem;
            border-radius: 1.1rem;
            line-height: 2.2rem;
            color: #FFF;
        }

        .register .login-btn button[disabled] {
            opacity: 0.6;
        }

        .goregis {
            font-size: 0.7rem;
            color: #999999;
            padding: 0.2rem 0.3rem;
            cursor: pointer;
            text-align: right;
            padding-right: 30px;
        }
    </style>
</head>

<body>
    <header id="header" class="aui-bar aui-bar-nav">
        <a class="aui-pull-left aui-btn" tapmode>
            <span class="aui-iconfont"></span>
        </a>
        <div class="aui-title">用户登陆</div>
    </header>
    <div id="aui-content" class="aui-content register">
        <div class="logo-box"> <img src="../icon/logo.png"></div>
        <div class="from-box">
            <div class="flex-row">
                <img src="../image/account.png">
                <input id="phone" type="text" value="请输入用户名"  placeholder="请输入用户名">
            </div>
            <div class="flex-row">
                <img src="../image/pass.png">
                <input id="pass" type="password" placeholder="请输入密码">
            </div>
        </div>
        <div class="row goregis" style="justify-content:flex-end">
            <span tapmode onclick="openWin('register')">没有账号？去注册</span>
        </div>
        <div class="login-btn"><button id="loginBtn" onclick="Login();" type="button">登陆</button></div>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../script/md5.min.js"></script>
<script type="text/javascript">
    var countdown = 60; //
    apiready = function() {
        initHeard();
        $api.fixStatusBar($api.byId('aui-content'));
            $("#phone").click(function(){

              if($("#phone").val()=='请输入用户名'){
              $("#phone").val("")

          }
            });
    };

    // 登陆事件
    function Login() {
        var phone = $("#phone").val();
        var pass = $("#pass").val();
        if (phone == '') {
            _msg("请输入账号")
            return false;
        } else if (pass == '') {
            _msg("请输入密码")
        }
        var data = {
            user_login: phone,
            devicecode: api.deviceId,
            user_pass: pass
        };
        console.log(JSON.stringify(data));
        _ajax("user/login", data, function(res, err) {
            if (res.errCode == 1) {
                console.log(JSON.stringify(res.data))
                $api.setStorage('token', res.data.token);
                $api.setStorage('user', JSON.stringify(res.data));
                _msg(res.msg);
                openWin('index', null, false);
                api.closeFrame();
            } else {
                _msg(res.msg);
            }
        })
    };
</script>

</html>
